<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>上传视频</title>
    <link rel="stylesheet" type="text/css" href="css/adminContent.css"/>
    <!-- 导入 Vue 3 -->
    <script src="https://unpkg.com/vue@next"></script>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div class="body">
    <form id="form1">
        <table width="100%" cellspacing="0">
            <tr>
                <td colspan="2" style="text-align: center;color: red;" v-html="tips.tip">&nbsp;</td>
            </tr>
            <h1 style="text-align: center">上传视频</h1>
            <tr>
                <td width="46%">标题</td>
                <td><input v-model="video.vtitle"/><span v-text="tips.tipvtitle"></span></td>
            </tr>
            <tr>
                <td>视频链接</td>
                <td><input v-model="video.vurl"/><span v-text="tips.tipvurl"></span></td>
            </tr>
            <tr>
                <td>封面链接</td>
                <td><input v-model="video.vcover"/><span v-text="tips.tipvcover"></span></td>
            </tr>
            <tr>
                <td>分栏</td>
                <td>
                    <select v-model="video.vlabel">
                        <option value="动漫">动漫</option>
                        <option value="番剧">番剧</option>
                        <option value="鬼畜">鬼畜</option>
                        <option value="音乐">音乐</option>
                        <option value="其它">其它</option>
                    </select>
                    <span v-text="tips.tipvlabel"></span>
                </td>
            </tr>

            <tr>
                <td>简介</td>
                <td><input v-model="video.vcomment" /></td>
            </tr>
            <tr>
                <td colspan="2" id="btnPanel">
                    <input type="button" value="保存" @click="doAdd()"/>
                    <input type="button" value="清空" @click="doClear()"/>
                </td>
            </tr>
        </table>
    </form>
</div>
</body>
<script src="../js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
<script>
    Vue.createApp({
        data() {
            return {
                video: {
                    vtitle: '',
                    vurl: '',
                    vcover: '',
                    vlabel: '',
                    vcomment: '',
                },
                tips: {
                    tip: '&nbsp;',
                    tipvtitle: '*',
                    tipvcover: '*',
                    tipvurl: '*',
                    tipvlabel: '*',
                }
            }
        },
        methods: {
            /*/!** 检查用户名是否已被注册: async + await 现实同步请求 *!/
            async checkUid(){
                if(this.video.uid == ''){
                    this.tips.tipUid = "用户名不能为空";
                    return false;
                }else{
                    this.tips.tipUid = "*";
                    let isExisted = false;
                    await axios({
                        method: 'post',
                        url:'/eshop/UserssController/selectUserss',
                        params:{
                            uid:this.video.uid
                        }
                    }).then(res => {
                        if('' != res.data && null != res.data){//用户名被注册
                            isExisted = true;
                        }
                    });

                    if(isExisted == true){
                        this.tips.tipUid = "用户名已被注册";
                        form1.uid.focus();	// 让用户名文本框获取焦点
                        return false;
                    }else{
                        this.tips.tipUid = "*";
                        return true;
                    }
                }
            },*/

            /** 新增保存*/
            async doAdd() {
                axios({
                    method: 'post',
                    url: '/video/insertVideo',
                    params: this.video
                }).then(res => {
                    if (res.data == true) {
                        this.tips.tip = "添加成功！";
                    } else {
                        this.tips.tip = "添加失败！";
                    }
                });
            },
            doClear() {
                this.video.vtitle = '';
                this.video.vurl = '';
                this.video.vcover = '';
                this.video.vlabel = '';
                this.video.vcomment = '';
            }
        }
    }).mount("#form1");
</script>
</html>

